<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="${pageContext.request.contextPath}/admin/scripts/jquery/jquery-1.7.1.js"></script>
<link href="${pageContext.request.contextPath}/admin/style/authority/basic_layout.css" rel="stylesheet" type="text/css">
<link href="${pageContext.request.contextPath}/admin/style/authority/common_style.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="${pageContext.request.contextPath}/admin/scripts/authority/commonAll.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/admin/scripts/fancybox/jquery.fancybox-1.3.4.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/admin/scripts/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/admin/style/authority/jquery.fancybox-1.3.4.css" media="screen"></link>
<script type="text/javascript" src="${pageContext.request.contextPath}/admin/scripts/artDialog/artDialog.js?skin=default"></script>

<title>信息管理系统</title>
<script type="text/javascript">

	/** 模糊查询  **/
	function search(){
		$("#submitForm").attr("action", "${pageContext.request.contextPath}/${page.url}").submit();
	}

	/!*删除*!/
	 function del(id){
		if(window.confirm("确认删除?")){
			$.ajax(
					{
						url:"${pageContext.request.contextPath}/AdminOrderServlet?method=deleteOrderById&oid="+id,
						method:'get',
						success: function(data){
							//alert(data);
							if(data.flag =='true') {
								alert("删除成功")
								window.location.href="${pageContext.request.contextPath}/AdminOrderServlet?method=findOrdersWithPage"
							}else{
								alert("删除失败")
							}
						},
						error:function(err){
							alert("删除失败");
						}
					});
			}
		}

</script>
<style>
	.alt td{ background:black !important;}
</style>
</head>
<body>
	<form id="submitForm" name="submitForm" action="" method="post">
		<input type="hidden" name="allIDCheck" value="" id="allIDCheck"/>
		<input type="hidden" name="fangyuanEntity.fyXqName" value="" id="fyXqName"/>
		<div id="container">
			<div class="ui_content">
				<div class="ui_text_indent">
					<div id="box_border">
						<div id="box_top" style="background: #9acfea">搜索</div>
						<div id="box_bottom">
							<span>订单Id或联系人:</span>
							<input type="text" id="fyZldz" name="keyWord" value="${keyWord}" class="ui_input_txt02" />
							<input type="button" value="查询" class="ui_input_btn01" onclick="search();" />
						</div>
					</div>
				</div>
			</div>
			<div class="ui_content">
				<div class="ui_tb">
					<table class="table" cellspacing="0" cellpadding="0" width="100%" align="center" border="0">
						<tr>
							<th>序号</th>
							<th>订单编号</th>
							<th>订单金额</th>
							<th>收货人</th>
							<th>订单状态</th>
							<th>订单时间</th>
							<th>订单详情</th>
							<th>操作</th>
						</tr>
						<c:forEach items="${page.list}" var="o" varStatus="status">
							<tr>
								<td>
										${status.count+page.startIndex}
								</td>
								<td>
										${o.oid}
								</td>
								<td >
										${o.total}￥
								</td>
								<td>
										${o.name}
								</td>
								<td>
									<c:if test="${o.state==1}">未付款</c:if>
									<c:if test="${o.state==2}">
										<a href="${pageContext.request.contextPath}/AdminOrderServlet?method=updateOrderByOid&oid=${o.oid}">发货</a>
									</c:if>
									<c:if test="${o.state==3}">已发货</c:if>
									<c:if test="${o.state==4}">订单完成</c:if>
								</td>
								<td>
									${o.orderTime}
								</td>
								<td align="center" style="HEIGHT: 22px" width="40%">
									<table border="1" width="100%" id="detail_${o.oid}">
										<!--
                                        <tr><th>商品</th><th>名称</th><th>单价</th><th>数量</th></tr>
                                        <tr><td><img src="/store_v5/products/1/c_0001.jpg" width="50px"/></td><td>XXX</td><td>XXX</td><td>XXX</td></tr>
                                        <tr>
                                            <td><img src="/store_v5/products/1/c_0001.jpg" width="50px"/></td>
                                         <td>XXX</td>
                                         <td>XXX</td>
                                         <td>XXX</td>
                                        </tr>
                                        -->
									</table>
								</td>
								<td>
									<input type="button" value="明细" id="${o.oid}" class="orderItem"/>
									<a href="javascript:del('${o.oid}');">删除</a>
								</td>
							</tr>
						</c:forEach>
						
					</table>
				</div>
				<div >
					<!--分页模块-->
					<%@ include file="/jsp/pageFile2.jsp" %>
				</div>
			</div>
		</div>
	</form>
</body>
<script>
	$(function(){
		$(".orderItem").click(function(){
			//获取当前订单id
			var id=this.id;
			//获取当前按钮文字
			var txt=this.value;
			//PS:获取到当前元素的同一行的table
			var $tb=$("#detail_"+id);
			if(txt=="明细"){
				//向服务端发送Ajax请求,将当前的订单id传递到服务端
				var url="${pageContext.request.contextPath}/AdminOrderServlet";
				var obj={"method":"findOrderByOidWithAjax","id":id};

				$.post(url,obj,function(data){
					//清除内容
					$tb.html("");
					var th="<tr><th>商品</th><th>名称</th><th>单价</th><th>数量</th></tr>";
					$tb.append(th);

					//利用JQUERY遍历响应到客户端的数据
					$.each(data,function(i,obj){
						var td="<tr><td><img src='${pageContext.request.contextPath}/"+obj.product.pimage+"' width='50px'/></td><td>"+obj.product.pname+"</td><td>"+obj.product.shop_price+"</td><td>"+obj.quantity+"</td></tr>";
						$tb.append(td);
					})
				},"json");

				this.value="关闭";

			}else{
				this.value="明细";
				//清空表格内容
				$tb.html("");
			}

		});
	});
</script>
</html>
